@page
@model Unified.payment.code.Pages.SmartPayModel
@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>智能支付跳转</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div class="container mt-5">
        <div class="row justify-content-center">
            <div class="col-md-6">
                <div class="card">
                    <div class="card-header">
                        <h4>智能支付跳转</h4>
                    </div>
                    <div class="card-body text-center">
                        @if (!string.IsNullOrEmpty(Model.WechatPayUrl) && !string.IsNullOrEmpty(Model.AlipayUrl))
                        {
                            <p>正在识别您的设备类型...</p>
                            <div class="spinner-border" role="status">
                                <span class="visually-hidden">Loading...</span>
                            </div>
                            
                            <script>
                                // 获取用户代理
                                var userAgent = navigator.userAgent.toLowerCase();
                                
                                // 判断是否为微信浏览器
                                var isWechat = userAgent.includes('micromessenger');
                                
                                // 判断是否为支付宝浏览器
                                var isAlipay = userAgent.includes('alipayclient');
                                
                                // 根据浏览器类型跳转到相应支付方式
                                if (isWechat) {
                                    window.location.href = '@Model.WechatPayUrl';
                                } else if (isAlipay) {
                                    window.location.href = '@Model.AlipayUrl';
                                } else {
                                    // 默认提示用户选择支付方式
                                    document.body.innerHTML = `
                                        <h5>请选择支付方式</h5>
                                        <div class="d-grid gap-2">
                                            <a href="@Model.WechatPayUrl" class="btn btn-success">微信支付</a>
                                            <a href="@Model.AlipayUrl" class="btn btn-primary">支付宝支付</a>
                                        </div>
                                        <p class="mt-3"><small>提示：请在微信或支付宝中打开此链接以获得最佳体验</small></p>
                                    `;
                                }
                            </script>
                        }
                        else
                        {
                            <div class="alert alert-danger" role="alert">
                                支付参数不正确，请重新生成二维码。
                            </div>
                        }
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>